const color = {
  'dialog-border-radius': '8px',
  'function': 'hy-main',
  theme: 'hy-main',
  theme02: 'hy-main/20',
  'theme-02': 'hy-main/20',
  theme05: 'hy-main/50',
  'theme-05': 'hy-main/50',
  add: 'hy-success',
  success: 'hy-success',
  success05: 'hy-success/50',
  'success-05': 'hy-success/50',
  'success-02': 'hy-success/20',
  info: 'hy-info',
  info05: 'hy-info/50',
  'info-05': 'hy-info/50',
  warning: 'hy-warning',
  warning05: 'hy-warning/50',
  'warning-05': 'hy-warning/50',
  danger: 'hy-danger',
  dangerv2: 'hy-danger',
  dangerv205: 'hy-danger/50',
  'dangerv2-05': 'hy-danger/50',
  dangerv202: 'hy-danger/20',
  'dangerv2-02': 'hy-danger/20',
  main: 'hy-text-main',
  auxiliary: 'hy-text-secondary',
  auxiliaryv2: 'hy-text-secondary',
  'background-gradientV2': 'hy-bg-gradient',
  'background-gradient': 'hy-bg-gradient-2',
  background: 'hy-page-bg-1',
  background05: 'hy-page-bg-1/50',
  backgroundv2: 'hy-page-bg-2',
  backgroundv205: 'hy-page-bg-2/50',
  backgroundv3: 'hy-page-bg-3',
  backgroundv305: 'hy-page-bg-3/50',
  backgroundv4: 'hy-page-bg-4',
  backgroundv405: 'hy-page-bg-4/50',
  border: 'hy-border-2',
  'dialog-border': 'hy-border-2',
  //
  'dialog-background': 'hy-dialog-bg-1',
  'dialog-backgroundv2': 'hy-dialog-bg-1',
  'dialog-backgroundv3': 'hy-dialog-bg-3',
  'select-color': 'hy-main',
  'main-select-color': 'hy-main',
  'main-select-color-05': 'hy-main/50',
  'item-background-auxiliary-color-05': 'hy-main/50',
  'border-main-color': 'hy-main',
  'app-background-color': 'hy-page-bg-1',
  'tableBackgroundColor': 'hy-page-bg-1',
  'background-main-color': 'hy-page-bg-2',
  'item-background-main-color': 'hy-page-bg-2',
  'background-auxiliary-color': 'hy-page-bg-3',
  'item-background-auxiliary-color': 'hy-page-bg-3',
  'iconBox-iconBox-background': 'hy-page-bg-3',
  'main-color': 'hy-text-main',
  'auxiliary-color': 'hy-text-secondary',
  'fontSize-main-color': 'hy-text-main',
  'fontSize-auxiliary-color': 'hy-text-secondary',
  'dialog-background-darkColor': 'hy-dialog-bg-1',
  'department-centerBox-background': 'hy-page-bg-2',
  'button-background': 'hy-page-bg-4'
}
const colorNotFoundList = []

// 获取 color
function getColor (key) {
  if (color[`${key}`]) {
    return color[`${key}`]
  } else {
    colorNotFoundList.push(key)
    return `var(--${key})`
  }
}

// 获取 var
function getVar (param) {
  const match = param.match(/var\(--([^)]+)\)/);
  return match ? match[1] : param
}

function getFourCornerContent (name, list) {
  let [param1, param2 , param3 , param4] = list
  return ` ${name}-[${param1 || '0px'}_${param2 || '0px'}_${param3 || '0px'}_${param4 || '0px'}]`;
}

function organizeStyles (data) {
  const fourCorners = {
    'left':'l',
    'right':'r',
    'top':'t',
    'bottom':'b'
  }

  function fn (item = {}) {
    for (const key in item) {
      const keyValue = item[`${key}`]
      data = data.replace(new RegExp(`\\s*\\n\\s*${key}:\\s*([^;]+);`, 'g'), (_, value) => {
        const type = value.includes('!important')
        let text = ''
        let list = []
        if (type) {
          list = value.split(' !important')[0].split(/\s+/);
        } else {
          list = value.split(/\s+/);
        }
          let [param1, param2 , param3 , param4] = list
          if (list.length === 1) {
            text = `${keyValue}-[${param1}]`
          } else if (list.length === 2) {
            if (param1 === '0px' || param1 === '0') {
              text = `${keyValue}x-[${param2}]`
            } else if (param2 === '0px' || param2 === '0') {
              text = `${keyValue}y-[${param1}]`
            } else {
              text = `${keyValue}-[${param1}_${param2}]`
            }
          } else if (list.length === 3) {
            text = `${keyValue}-[${param1}_${param2}_${param3}]`
          } else if (list.length === 4) {
            text = `${keyValue}-[${list[0]}_${list[1]}_${list[2]}_${list[3]}]`
          } else {
            text = `${getFourCornerContent(keyValue, param1)}`
          }
          return ` ${type ? '!': ''}${text}`
        });
      // 四个角
      for (const fourCornersKey in fourCorners) {
        const fourCornersKeyValue = fourCorners[`${fourCornersKey}`]
        data = data.replace(new RegExp(`${key}-${fourCornersKey}:\\s*([^;]+);`, 'g'), (_, value) => {
          const type = value.includes('!important')
          let list = []
          if (type) {
            value = value.split('!important')[0]
            list = value.split(/\s+/);
          } else {
            list = value.split(/\s+/);
          }
          let [param1, param2 , param3 , param4] = list
          return ` ${type ? '!': ''}${keyValue}${fourCornersKeyValue}-[${param1}]`
        });
      }
    }
  }

  function fn1 (item = {}) {
    for (const key in item) {
      const keyValue = item[`${key}`]
      data = data.replace(new RegExp(`\\s*\\n\\s*${key}:\\s*([^;]+)`, 'g'), (_, value) => {
        const list = [] = value.split(/\s+/);
        let [param1, param2 , param3 , param4] = list
        if (param1 === '0') {
          return ` ${keyValue}-0`
        } else if (param1 === '100%') {
          return ` ${keyValue}-full`
        } else {
          return ` ${keyValue}-[${param1}]`
        }
      });
    }
  }
  function fn2 (list = []) {
    for (let i = 0; i < list.length; i++) {
      const key = list[i]
      data = data.replace(new RegExp(`\\s*\\n\\s*${key}:\\s*([^;]+)`, 'g'), (_, value) => {
        const list = [] = value.split(/\s+/);
        let [param1, param2 , param3 , param4] = list
        return ` ${param1}`
      });
    }
  }

  function fn3 (item = {}) {
    for (const key in item) {
      const keyValue = item[`${key}`]
      data = data.replace(new RegExp(`\\s*\\n\\s*${key}:\\s*([^;]+)`, 'g'), (_, value) => {
        const list = [] = value.split(/\s+/);
        let [param1, param2 , param3 , param4] = list
        let text = ''
        if (param1 === 'flex-start') {
          text = 'start'
        } else if (param1 === 'flex-end') {
          text = 'end'
        } else if (param1 === 'space-between') {
          text = 'between'
        } else if (param1 === 'space-around') {
          text = 'around'
        } else if (param1 === 'space-evenly') {
          text = 'evenly'
        } else {
          text = param1
        }
        return ` ${keyValue}-${text}`
      });
    }
  }

  data = data.replace(new RegExp(/line-height:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` leading-[${param1}]`
  });
  // data = data.replace(/\s*\n\s*(?!(\s*\.\w))/g, ' ')
  // data = data.replace(/{\s/g, '{\n')
  // data = data.replace(/\s}/g, '\n}')
  fn({
    'padding': 'p',
    'margin': 'm'
  })
  fn1({
    'width': 'w',
    'max-width': 'max-w',
    'min-width': 'min-w',
    'height': 'h',
    'max-height': 'max-h',
    'min-height': 'min-h',
  })
  fn2([
    'position',
    'box-sizing',
    'display'
  ])
  fn3({
    'justify-content': 'justify',
    'align-content': 'content',
    'align-items': 'items',
    'text-align': 'text',
    'cursor': 'cursor',
    'flex-shrink': 'shrink',
  })

  data = data.replace(new RegExp(/color:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` text-${getColor(getVar(param1))}`
  });

  for (const fourCornersKey in fourCorners) {
    const fourCornersKeyValue = fourCorners[`${fourCornersKey}`]
    data = data.replace(new RegExp(`\\s*\\n\\s*${fourCornersKey}:\\s*([^;]+);`, 'g'), (_, value) => {
      const type = value.includes('!important')
      let text = ''
      let list = []
      if (type) {
        value = value.split('!important')[0]
        list = value.split(/\s+/);
      } else {
        list = value.split(/\s+/);
      }
      let [param1, param2 , param3 , param4] = list
      if (param1 === '0px') {
        text = `${fourCornersKey}-0`
      } else {
        text = `${fourCornersKey}-[${param1}]`
      }
      return ` ${type ? '!': ''}${text}`
    });
  }

  data = data.replace(new RegExp(/\s*\n\s*color:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` text-${getColor(getVar(param1))}`
  });
  data = data.replace(new RegExp(/\s*\n\s*background:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (param1.includes('var')) {
      return ` bg-${getColor(getVar(param1))}`
    }
    return _
  });

  data = data.replace(new RegExp(/\s*\n\s*border:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 3) {
      if (param2 === 'solid') {
        return ` border border-${getColor(getVar(param3))}`
      } else {
        return ` border border-${param2} border-${getColor(getVar(param3))}`
      }
    }
  });
  data = data.replace(new RegExp(/\s*\n\s*border-right:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 3) {
      if (param2 === 'solid') {
        return ` border-r border-${getColor(getVar(param3))}`
      } else {
        return ` border-r border-${param2} border-${getColor(getVar(param3))}`
      }
    }
  });
  data = data.replace(new RegExp(/\s*\n\s*border-left:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 3) {
      if (param2 === 'solid') {
        return ` border-l border-${getColor(getVar(param3))}`
      } else {
        return ` border-l border-${param2} border-${getColor(getVar(param3))}`
      }
    }
  });
  data = data.replace(new RegExp(/\s*\n\s*border-top:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 3) {
      if (param2 === 'solid') {
        return ` border-t border-${getColor(getVar(param3))}`
      } else {
        return ` border-t border-${param2} border-${getColor(getVar(param3))}`
      }
    }
  });
  data = data.replace(new RegExp(/\s*\n\s*border-bottom:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 3) {
      if (param2 === 'solid') {
        return ` border-b border-${getColor(getVar(param3))}`
      } else {
        return ` border-b border-${param2} border-${getColor(getVar(param3))}`
      }
    }
  });

  data = data.replace(new RegExp(/\s*\n\s*transition:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (param1 === '0.1s') {
      return ' duration-100'
    } else if (param1 === '0.2s') {
      return ' duration-200'
    } else if (param1 === '0.3s') {
      return ' duration-300'
    } else if (param1 === '0.4s') {
      return ' duration-400'
    } else if (param1 === '0.5s') {
      return ' duration-500'
    } else if (param1 === '0.6s') {
      return ' duration-600'
    } else if (param1 === '0.7s') {
      return ' duration-700'
    } else if (param1 === '0.8s') {
      return ' duration-800'
    } else if (param1 === '0.9s') {
      return ' duration-900'
    } else if (param1 === '1s') {
      return ' duration-1000'
    }
    return _
  });
  data = data.replace(new RegExp(/\s*\n\s*z-index:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` z-[${param1}]`
  });
  data = data.replace(new RegExp(/\s*\n\s*font-weight:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (param1 === 'bold' || param1 === '600') {
      return ' font-bold'
    } if (param1 === 'inherit' || param1 === '300') {
      return ' font-[300]'
    }
    return ` font-[${param1}]`
  });
  data = data.replace(new RegExp(/\s*\n\s*font-size:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (param1 === '12px') {
      return ' text-xs'
    } else if (param1 === '14px') {
      return ' text-sm'
    } else if (param1 === '16px') {
      return ' text-base'
    }
    return ` text-[${param1}]`
  });
  data = data.replace(new RegExp(/\s*\n\s*border-radius:\s*([^\s;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 1) {
      return param1 === '4px' ? ' rounded' : ` rounded-[${param1}]`
    } else {
      return getFourCornerContent('rounded', param1)
    }
  });
  data = data.replace(new RegExp(/\s*\n\s*box-shadow:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    // box-shadow: 0px 0px 10px 0px var(--theme) inset;
    let [param1, param2 , param3 , param4, param5, param6] = list
    const insetType = value.includes('inset')

    if (param1 === 'var(--box-shadow)') {
      return ` shadow-[0_0_10px_0_inset] shadow-${getColor('theme')}`
    } else  if (param1 === 'var(--dialog-box-shadow)') {
      return ` shadow-[0_0_10px_4px_transparent]`
    }
    const param5Content = param5.match(/var\(--([\s\S]*?)\)/)[1]
    if (insetType) {
      return ` shadow-[${param1}_${param2}_${param3}_${param4}_inset] shadow-${getColor(param5Content)}`
    } else {
      return ` shadow-[${param1}_${param2}_${param3}_${param4}] shadow-${getColor(param5Content)}`
    }
  });
  data = data.replace(new RegExp(/\s*\n\s*opacity:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
     if (param1 === '0.1') {
      return ' opacity-100'
    } else if (param1 === '0.2') {
      return ' opacity-200'
    } else if (param1 === '0.3') {
      return ' opacity-300'
    } else if (param1 === '0.4') {
      return ' opacity-400'
    } else if (param1 === '0.5') {
      return ' opacity-500'
    } else if (param1 === '0.6') {
      return ' opacity-600'
    } else if (param1 === '0.7') {
      return ' opacity-700'
    } else if (param1 === '0.8') {
      return ' opacity-800'
    } else if (param1 === '0.9') {
      return ' opacity-900'
    } else if (param1 === '1s') {
      return ' opacity-1000'
    }
    return ' opacity-0'
  });
  data = data.replace(new RegExp(/\s*\n\s*flex-direction:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    param1 = param1.replace('column', 'col')
    return ` flex-${param1}`
  });
  data = data.replace(new RegExp(/\s*\n\s*flex-grow:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return  param1 === '1' ? ' flex-grow' : ' flex-grow-0'
  });

  data = data.replace(new RegExp(/\s*\n\s*overflow:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` overflow-${param1}`
  });
  data = data.replace(new RegExp(/\s*\n\s*overflow-x:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` overflow-x-${param1}`
  });
  data = data.replace(new RegExp(/\s*\n\s*overflow-y:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` overflow-y-${param1}`
  });
  data = data.replace(new RegExp(/\s*\n\s*transform:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    if (list.length === 1) {
      if (param1 === 'translateX(-50%)') {
        return  '-translate-x-1/2'
      } else if (param1 === 'translateY(-50%)') {
        return  '-translate-y-1/2'
      }
    } if (value === 'translate(-50%, -50%)') {
      return  '-translate-y-1/2 -translate-x-1/2'
    }
    return _
  });
  data = data.replace(new RegExp(/\s*\n\s*overflow-y:\s*([^;]+)/, 'g'), (_, value) => {
    const list = [] = value.split(/\s+/);
    let [param1, param2 , param3 , param4] = list
    return ` overflow-y-${param1}`
  });

  data = data.replace(new RegExp(';', 'g'), '')
  data = data.replace(/{/g, '{\n\ ')
   return {
     data,
     colorNotFoundList
   }
}

function testOrganizeStyles (data) {
  data = data.replace(/var\(--([\s\S]*?)\)/g, (_, v) => {
   const content = getColor(v)
    if (content.includes('var(--')) {
      if (v === 'dialog-box-shadow') {
        return '0 0 10px 4px transparent'
      }
      return _
    }
    if (content.includes('px')) {
      return content
    } else {
      _ = _.replace(v, content)
      return _
    }
  })
  return {
    data
  }
}

const database = {
  organizeStyles,
  testOrganizeStyles
}

module.exports = database
